<style lang="scss" scoped>
  @import '../../styles/common/loading.less';
  .container{
    border: none !important;
    margin-top: 4px;
  }
  .el-col-offset-1 {
    margin-left: 0%;
  }
  .button_a {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);

  }
  .col_a {
    margin-left: 2%;
  }
  .el-card {
    height: 200px;
  }

  .el-button--primary {
    background-color: rgba(255, 138, 0, 1);
    border-color: rgba(255, 138, 0, 1);
  }
  .input-textarea{
    height: 87px !important
  }
</style>
<template>
    <div class="common-background-color">
      <div style="width:98%;height:100%;margin: 6px 12px;">
        <el-collapse v-model="activeNames" v-if="this.item===1" @change="handleChange"  >
          <el-collapse-item title="基本信息"  name="1">
            <!-- 基本信息 -->
              <template>
                <el-form :rules="rules" ref="formInline" :model="formInline" class="info-submit-form">
                  <el-row type="flex">
                    <el-col :span="8">
                      <el-form-item label="大病赔案号">
                        <el-input  v-model="formInline.caseNo" placeholder="请输入任务号" disabled></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="8">
                      <el-form-item label="保单号">
                        <el-input v-model="formInline.policyNo" disabled placeholder="请输入被保险人"></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="8" >
                      <el-form-item label="被保险人" >
                        <el-input v-model="formInline.insuredName" disabled placeholder="请输入被保险人"></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row type="flex">
                    <el-col :span="8" >
                      <el-form-item label="社/医保号">
                        <el-input v-model="formInline.medicalInsuranceNo" disabled placeholder="请输入社保号"></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="8" >
                      <el-form-item label="证件类型">
                        <el-input v-model="formInline.documentType" disabled placeholder="请输入证件类型"></el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="8" >
                      <el-form-item label="证件号">
                        <el-input v-model="formInline.documentNo" disabled placeholder="请输入证件号"></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row type="flex">
                    <el-col :span="8"  >
                      <el-form-item prop="surveyReason" label="调查原因">
                        <el-input v-model="formInline.surveyReason" disabled placeholder="请输入原因">
                          <el-option
                            v-for="item in SurveyType"
                            :key="item.codeCode"
                            :label="item.codeCName"
                            :value="item.codeCode">
                          </el-option>
                        </el-input>
                      </el-form-item>
                    </el-col>
                    <el-col :span="8" >
                      <el-form-item label="原因描述">
                        <el-input v-model="formInline.surveyDescribe" disabled placeholder="请输入原因描述"></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row type="flex" class="input-textarea">
                    <el-col :span="24">
                      <el-form-item label="地点描述" prop="addressDesc">
                        <el-input show-word-limit v-model="formInline.addressDesc" type="textarea" placeholder="" ></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row type="flex" class="input-textarea">
                    <el-col :span="24">
                      <el-form-item label="经过" prop="surveyProcess">
                        <el-input show-word-limit  v-model="formInline.surveyProcess" type="textarea" placeholder=""></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row type="flex" class="input-textarea">
                    <el-col :span="24">
                      <el-form-item label="描述" prop="surveyRemark">
                        <el-input show-word-limit v-model="formInline.surveyRemark" type="textarea" placeholder="" ></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                  <el-row type="flex" class="input-textarea">
                    <el-col :span="24">
                      <el-form-item label="结论" prop="surveyResult">
                        <el-input show-word-limit  v-model="formInline.surveyResult" type="textarea" placeholder="" ></el-input>
                      </el-form-item>
                    </el-col>
                  </el-row>
                </el-form>
              </template>
          </el-collapse-item>
        </el-collapse>
        <el-collapse v-model="activeNames" v-if="this.item===0" @change="handleChange">
          <el-collapse-item title="基本信息"  name="1">
            <!-- 基本信息 -->
            <template>
              <el-form :rules="rules" ref="formInline" :model="formInline" class="info-submit-form">
                <el-row type="flex">
                  <el-col :span="8"  >
                    <el-form-item label="大病赔案号">
                      <el-input  v-model="formInline.caseNo"  disabled></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8" >
                    <el-form-item label="保单号" >
                      <el-input v-model="formInline.policyNo" disabled></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8" >
                    <el-form-item label="被保险人" >
                      <el-input v-model="formInline.insuredName" disabled></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row type="flex">
                  <el-col :span="8" >
                    <el-form-item label="社/医保号">
                      <el-input v-model="formInline.medicalInsuranceNo" disabled></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8" >
                    <el-form-item label="证件类型">
                      <el-input v-model="formInline.documentType" disabled></el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8" >
                    <el-form-item label="证件号">
                      <el-input v-model="formInline.documentNo" disabled></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row type="flex">
                  <el-col :span="8"  >
                    <el-form-item prop="surveyReason" label="调查原因"  >
                      <el-input v-model="formInline.surveyReason" disabled>
                        <el-option
                          v-for="item in SurveyType"
                          :key="item.codeCode"
                          :label="item.codeCName"
                          :value="item.codeCode">
                        </el-option>
                      </el-input>
                    </el-form-item>
                  </el-col>
                  <el-col :span="8" >
                    <el-form-item label="原因描述">
                      <el-input v-model="formInline.surveyDescribe" disabled placeholder="请输入原因描述"></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row type="flex" class="input-textarea">
                  <el-col :span="24">
                    <el-form-item label="地点描述" prop="addressDesc">
                      <el-input :rows="3" show-word-limit disabled v-model="formInline.addressDesc" type="textarea" placeholder="" ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row type="flex" class="input-textarea">
                  <el-col :span="24">
                    <el-form-item label="经过" prop="surveyProcess">
                      <el-input :rows="3" show-word-limit disabled  v-model="formInline.surveyProcess" type="textarea" placeholder=""></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row type="flex" class="input-textarea">
                  <el-col :span="24">
                    <el-form-item label="描述" prop="surveyRemark">
                      <el-input :rows="3" show-word-limit disabled v-model="formInline.surveyRemark" type="textarea" placeholder="" ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
                <el-row type="flex" class="input-textarea">
                  <el-col :span="24">
                    <el-form-item label="结论" prop="surveyResult">
                      <el-input :rows="3" show-word-limit disabled  v-model="formInline.surveyResult" type="textarea" placeholder="" ></el-input>
                    </el-form-item>
                  </el-col>
                </el-row>
              </el-form>
            </template>
          </el-collapse-item>
        </el-collapse>
        <el-collapse  v-model="activeNames" @change="handleChange"  >
          <el-collapse-item title="调查历史轨迹信息"  name="2">
            <!-- 调查轨迹信息 -->
              <template>
                        <el-table
                          :data="researchHistory"
                          class="table"
                          ref="multipleTable"
                          header-cell-class-name="table-header"
                          style="margin: 5px 0;border: 1px solid #d6d9d8;"
                        >
                          <el-table-column type="index" label="序号" width="55" align="center"></el-table-column>
                          <el-table-column label="大病赔案号" align="center">
                            <template slot-scope="scope" >
                              <a @click="applicant(scope.row)" style="color: #1e99f9;cursor: pointer">{{ scope.row.caseNo }}</a>
                            </template>
                          </el-table-column>
                          <el-table-column prop="policyNo" label="保单号" align="center"></el-table-column>
                          <el-table-column prop="handlerCode" label="调查员工号" align="center"></el-table-column>
                          <el-table-column prop="handlerName" label="调查员姓名" align="center"></el-table-column>
                          <el-table-column prop="surveyReason" :formatter="surveyReasonFormat" label="调查原因" align="center"></el-table-column>
                          <el-table-column prop="surveyResult" label="调查结论" align="center"></el-table-column>
                          <el-table-column prop="auditTime" label="调查时间" align="center"></el-table-column>
                        </el-table>
                      <!-- </div>
                    </el-card>
                  </el-tab-pane>
                </el-tabs>-->
              </template>
          </el-collapse-item>
        </el-collapse>
      </div>
      <div>
          <template>
              <div style="margin-top: 25px;padding-bottom: 50px;margin-left: 35%;height: 70px">
<!--                  <el-button type="primary" size="medium" class="button_a">影像上传</el-button>-->
                <el-button type="primary" size="medium" @click="imgUPload">单证上传</el-button>
                <el-button type="primary" size="medium" @click="imgQueryShow">查看单证</el-button>
<!--                      <el-button type="success"  size="medium" class="button_a">暂存</el-button>-->
                  <el-button type="success"  size="medium" @click="onSubmitResearchTaskDetaik('formInline')" class="button_a">提交审核</el-button>
                  <el-button type="danger" size="medium" @click="ondelete" class="button_a">关闭</el-button>
              </div>
          </template>
      </div>
      <el-dialog
        :visible.sync="Successdialog"
        :show-close="false"
        :close-on-click-modal="true"
        :close-on-press-escape="false"
        width="20%"
        center>
        <div style="margin-top: -35px;">
          <div>| 调查审核提交</div>
          <hr style="width: 80%;margin-left: 1px">
        </div>
        <div v-if="this.item===0" style="text-align: center;margin-top: 20px">
          <img src="../../assets/images/pass.png" width="60">
          <div style="margin-top: 10px">提交成功</div>
          <div style="margin-top: 10px">大病赔案号：{{formInline.caseNo}}</div>
        </div>
        <div v-if="this.item===1" style="text-align: center;margin-top: 20px">
          <img src="../../assets/images/notPass.png" width="60">
          <div style="margin-top: 10px">提交失败</div>
          <div style="margin-top: 10px">大病赔案号：{{formInline.caseNo}}</div>
        </div>
        <div style="margin-top: 15px;text-align: center"><span style="font-size: x-large">{{time}}</span>秒后跳转到上一个页面</div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="researchCheckSearch" type="text" :disabled="isDisabled">关闭</el-button>
        </div>
      </el-dialog>
    </div>
</template>

<script>
  import * as api from '@/api/baseDate'
  import Cookies from "js-cookie";
    export default {
        name: 'researchTask',
        data() {
            return {
              rules: {
                addressDesc: [ // 地点描述 addressDesc 经过 surveyProcess 描述 surveyRemark 结论 surveyResult
                  { required: true, message: '地点描述不能为空', trigger: 'change' },
                  /*{ min: 3, max: 5, message: '长度在 3 到 5 个字符', trigger: 'blur' }*/
                ],
                surveyProcess: [
                  { required: true, message: '经过不能为空', trigger: 'change' }
                ],
                surveyRemark: [
                  { required: true, message: '描述不能为空', trigger: 'change' },
                ],
                surveyResult: [
                  { required: true, message: '结论不能为空', trigger: 'change' }
                ],
              },
              //影像单证参数
              imgInfo: {
                  policyNo: '',
                  bussNo: '',
                  comCode: '',
                  userCode: ''
              },
                query: {
                    address: '',
                    name: '',
                    pageIndex: 1,
                    pageSize: 10
                },
              activeNames: ['1','2'],
                //控制显示隐藏
                isBase:false,
                isSurvey:false,
                shenheyijian:"1",
                activeName: 'first',
                multipleSelection: [],
                SurveyType:[
                  {
                    codeCode:'1',
                    codeCName:'频繁报销'
                  },
                  {
                    codeCode:'2',
                    codeCName:'异地就医'
                  },
                  {
                    codeCode:'9',
                    codeCName:'其它'
                  }
                ],
                delList: [],
                editVisible: false,
                pageTotal: 0,
                form: {},
                idx: -1,
                id: -1,
                formInline: {},
                researchHistory:[
                    {
                        caseNo:"20210721001",
                        handlerOrg:"江苏省徐州",
                        handler:"李刚",
                        submitTime:'2021-01-01',
                        surveyPass:'调查中',
                        surveyResult:'通过无误',
                        surveyVerdict:'可以提交审核'
                    }
                ],
              Successdialog:false,
              time:0,
              item:0,
            };
        },
      created() {
        // this.formInline=localStorage.getItem("researchTaskDetail")
        this.formInline=JSON.parse(this.$route.query.researchTaskDetail)
        this.item=JSON.parse(this.$route.query.item)
        if (this.formInline.surveyReason ==='1' ) {
          this.formInline.surveyReason='频繁报销'
        } else if (this.formInline.surveyReason === '2') {
          this.formInline.surveyReason='异地就医'
        } else if (this.formInline.surveyReason === '9') {
          this.formInline.surveyReason='其它'
        }
        this.getQuerySurveyHistory();
      },
        methods: {
        //单证上传方法
          imgUPload() {
              this.imgInfo.userCode=  Cookies.get("userCode");
              this.imgInfo.policyNo=this.formInline.policyNo;
              this.imgInfo.comCode=this.formInline.comCode;
              this.imgInfo.bussNo=this.formInline.caseNo;

              if(this.imgInfo.policyNo != null  && this.imgInfo.bussNo != null && this.imgInfo.comCode != null && this.imgInfo.userCode != null){
                api.imgUPload(this.imgInfo).then(res => {
                    window.open(res.data.url)
                })
              } else {
                 this.$message.error(`请您先暂存后，再上传影像资料！`);
              }
          },
          //查看单证方法
          imgQueryShow(){
             this.imgInfo.bussNo= this.prpLCaseDamageDTO.caseNo;
             console.log(this.imgInfo.bussNo)
             if(this.imgInfo.bussNo !== null){
               api.imgQueryShow(this.imgInfo.bussNo).then(res => {
                  window.open(res.data.url)
               })
             }else{
                 this.$message.error(`请您先暂存后，再上传影像资料！`);
             }
          },
          surveyReasonFormat(row, column) {
            let surveyReason = row.surveyReason
            if (surveyReason === '1') {
              return '频繁报销'
            } else if (surveyReason === '2') {
              return '异地就医'
            } else if (surveyReason === '9') {
              return '其它'
            }
          },
          getQuerySurveyHistory(){
            var data={
              "handlerName":this.formInline.handlerName,
            }
            api.getQuerySurveyHistory(data
            ).then(res => {
              this.researchHistory=res.data;
              console.log("历史轨迹"+res)
            })
          },
          onSubmitResearchTaskDetaik(formName){
            this.$refs[formName].validate((valid) => {
              if (valid) {
                var data={
                  "id":this.formInline.id,
                  "taskType":this.formInline.taskType,
                  "caseNo":this.formInline.caseNo,
                  "flowId":this.formInline.flowId,
                  "addressDesc":this.formInline.addressDesc,
                  "surveyProcess":this.formInline.surveyProcess,
                  "surveyRemark":this.formInline.surveyRemark,
                  "surveyResult":this.formInline.surveyResult,
                  "taskState":this.formInline.taskState,
                }
                api.getSubmitCaseSurvey(data
                ).then(res => {
                  this.Successdialog=true
                  // 把time改为5
                  this.time = 5;
                  // 设定一个定时器，每一秒调用一次coundDown方法，time-1
                  setInterval(this.countDown, 1000);
                }).catch((function () {
                    /*let THIS = this;*/
                    this.item=1,
                      this.Successdialog=true
                    // 把time改为5
                    this.time = 5;
                    // 设定一个定时器，每一秒调用一次coundDown方法，time-1
                    setInterval(this.countDown, 1000);
                  }),
                )
              } else {
                console.log('error submit!!');
                return false;
              }
            });

          },
          applicant(row){
            this.form=row,
            this.$router.push({
              name: 'historicalRoute',
              query: {
                form: JSON.stringify(this.form),
                formInline: JSON.stringify(this.formInline),
                item: JSON.stringify(this.item),
                its: JSON.stringify(0)
              }
            })
          },
          ondelete(){
            this.$router.go(-1)
          },
                isBaseInfo(){
                    this.isBase=!this.isBase;
                },
                surveyHistory(){
                    this.isSurvey=!this.isSurvey;
                },
                // 分页导航
                handlePageChange(val) {
                    this.$set(this.query, 'pageIndex', val);
                    this.getData();
                },
                onSubmit() {
                    console.log('submit!');
                },
          researchCheckSearch(){
            this.Successdialog=false
            // this.$router.push({name:'researchTask'});
            this.closePageTo(this.$store,this.$route,this.$router,'researchTask'); 
          },
//   封装一个方法
          countDown() {
            let THIS = this;
            THIS.time--;
          },
        },
      watch: {
        //   监听time的值
        time: function (newVal) {
          if (newVal == 0) {
            //this.$router.push({name:'researchTask'});
            this.closePageTo(this.$store,this.$route,this.$router,'researchTask');
            this.Successdialog=false
          }
        },
      },
    };
</script>